<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>v-model列表框 select类型</title>
        <script src="../js/vue.js"></script>
    </head>
<body>
  <div id="app">
    <!--列表框，单选的时候v-model绑定的是选项的值，多选的时候是数组-->
        <!--选择一个v-model绑定选项的值-->
        <select name=" " v-model="fruit">
            <option value="苹果">苹果</option>
            <option value="梨子">梨子</option>
            <option value="葡萄">葡萄</option>
            <option value="西瓜">西瓜</option>
        </select>
        <p>{{fruit}}</p>
  
  </div>
<br>
  <script>
    let app = new Vue({
      el:"#app",
      data:{ 
        fruit:'西瓜'
      }
    })
  </script>
</body>
</html>
    


       